<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/01.css">
    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
    <link rel="stylesheet" href="https://at.alicdn.com/t/font_2112023_fd5d8vx0mns.css">
<body>
        <div class="content">
            <div id="list">
                <img src="images/1.jpg" alt="">
                <img src="images/slide-1.jpg" alt="">
                <img src="images/slide-2.jpg" alt="">
            </div>
            <button id="prev"></button>
            <button id="next"></button>
            <div id="btns">
                <span class="current"></span>
                <span></span>
                <span></span>
            </div>
        </div>
        <div class="zhezhao">
            <h1>HELLO WE'RE FAMILY</h1>
            <h2>H5 极客影视</h2>
            <img class="img1" src="images/想你所想.png" alt="">
            <h3>2020实训成果展</h3>
        </div>
        <div class="daohang">
            <div class="daohangleft">
                <p class="text"> 回到顶部<br>Back to top</p>
            </div>
            <div class="daohangright">
                <ul>
                    <li class="hjk1">联系合作<br>Contact and cooperation</li>
                    <li class="hjk2">团队成员<br>Team members</li>
                    <li class="hjk3">项目开发<br>Project development</li>
                    <li class="hjk4">团队介绍<br>Team Introduction</li>
                </ul>
            </div>
        </div>
        <div class="introduction">
            <div class="int1">
                <h1>团队介绍</h1>
                <h4>Team Introduction</h4>
                <div class="line"></div>
                <p>我们的团队不光在技术上处于行业前端，我们更注重将客户的产品表达的清楚与准确，我们成员百分之百是理科出身，在机械、游戏、电子、物理等各学科都有研究，能轻松理解客户的构思，所以我们能更好的将客户的意图表现出来。我们拥有自己的专业制作团队。在技术层面不断创新与提高，运用尖端的技术，不断满足客户对数字体验服务的需求。我们的目标是将本团队打造成国内前端行业第一品牌。</p>
                <div class="one">
                    <div class="skill1">
                        <span class="iconfont icon-dc-icon-keyanyuansuo"></span>
                        <p>开发</p>
                    </div>
                    <p class="onep">Web开发 小程序开发 网页设计<br><br>我们重视开发，拥有专业的团队为您量身定制各种需求</p>
                </div>
                <div class="two">
                    <div class="skill1">
                        <span class="iconfont icon-yewutubiao_keyanxitong"></span>
                        <p>创新</p>
                    </div>
                    <p class="onep">重视创新 培养人才 注入生命力<br><br>我们注重创新，想法大胆，走在互联网前沿，项目经常让客户感到赞叹</p>
                </div>
                <div class="three">
                    <div class="skill1">
                        <span class="iconfont icon-hulianwang"></span>
                        <p>互联网+</p>
                    </div>
                    <p class="onep">大数据分析 精准定位<br><br>本团队建立已有十余年积累了大量经验更能审时度势</p>
                </div>
                <div class="four">
                    <div class="skill1">
                        <span class="iconfont icon-team-fill"></span>
                        <p>合作共赢</p>
                    </div>
                    <p class="onep">合作共赢<br><br>注重客户使用感受用心雕刻每一个细节反复打磨</p>
                </div>
            </div>
        </div>
        <div class="jieshao">
            <div class="int2">
                <h1>项目开发</h1>
                <h4>Project development</h4>
                <div class="line1"></div>
                <p>召集需求涉及到的UI、开发、产品、测试人员整理业务流程，同步信息，明确分工。明确需求目的，考虑当前需求设计是否可满足目的，整理流程中如果涉及的其他人员，则召集商讨。如需求设计上影响现有业务功能，应要求产品重新设计实现方案，然后重新评审。<br>以下是公司业务</p>
                <div class="int-y">
                    <span class="iconfont icon-weixin"></span>
                    <p>微信小程序开发</p>
                </div>
                <div class="int-e">
                    <span class="iconfont icon-jquery"></span>
                    <p>实时通讯项目开发</p>
                </div>
                <div class="int-s">
                    <span class="iconfont icon-hulianwang"></span>
                    <p>物联网项目</p>
                </div>
                <div class="int-p">
                    <span class="iconfont icon-html5"></span>
                    <p>网页维护与开发</p>
                </div>
                <div class="int-w">
                    <span class="iconfont icon-PCtaishiji"></span>
                    <p>Java软件开发</p>
                </div>
                <div class="int-l">
                    <span class="iconfont icon-hongzhizhu"></span>
                    <p>网络爬虫技术</p>
                </div>
            </div>
        </div>
        <div class="team1">
            <div class="imp1">
                <h1>团队成员</h1>
                <h4>Team members</h4>
                <div class="line2"></div>
                <p>本团队核心成员有6人，均为本公司的重要技术人员，善于开发各种软件，解决各种问题。拥有数年的工作经验。</p>
                
                <div class="pl1">
                     <a href="https://ding-zhiyuan.gitee.io/homework7676">
                    <div class="pl1img">
                        <img src="images/pengyuyan.jpg" alt="">
                    </div>
                    <h3>丁志远</h3>
                    <h5>微信小程序开发项目经理</h5>
                </a>
                </div>
                
                
                <div class="pl2">
                    <a href="https://liang-yin.gitee.io/homework-7/">
                    <div class="pl1img">
                        <img src="images/wuyanzu.jpg" alt="">
                    </div>
                    <h3>梁寅</h3>
                    <h5>亚太地区实时通讯项目开发项目经理</h5>
                </a>
                </div>
                
                
                <div class="pl3">
                    <a href="https://barbarism-abyssinian.gitee.io/web2">
                    <div class="pl1img">
                        <img src="images/zhangmanyu.jpg" alt="">
                    </div>
                    <h3>张宁远</h3>
                    <h5>物联网项目中国区董事</h5>
                </a>
                </div>
                
                
                    <div class="pl4">
                        <a href=" https://durian-girl.gitee.io/personal-introduction
                ">
                        <div class="pl1img">
                            <img src="images/zhangjie.jpg" alt="">
                        </div>
                        <h3>刘新宇</h3>
                        <h5>网页维护与开发部门经理</h5>
                    </a>
                    </div>
                
                
                <div class="pl5">
                    <a href="https://wang-xue0.gitee.io/work5">
                    <div class="pl1img">
                        <img src="images/dilireba.jpg" alt="">
                    </div>
                    <h3>王薛</h3>
                    <h5>Java软件开发主管</h5>
                </a>
                </div>
                
                
                    <div class="pl6">
                        <a href="https://su-qingqing.gitee.io/big-assignment-demo
                ">
                        <div class="pl1img">
                            <img src="images/huge.jpg" alt="">
                        </div>
                        <h3>苏青青</h3>
                        <h5>网络爬虫技术执行经理</h5>
                    </a>
                    </div>
                
            </div>
            <div class="past3">
                <div class="last">
                    <h1>联系合作</h1>
                    <h4>Contact and cooperation</h4>
                    <div class="line3"></div>
                    <p>我们将会竭诚为您服务，期待创造辉煌的成果，共同蜕变，我们期待您的来访和来电！</p>
                    <div id="asd">
                        <h1>联系我们</h1>
                        <p>contact us</p>
                        <h2>位置：</h2>
                        <p>position:</p>
                        <h3>安徽省淮北市烈山区烈山镇淮北师范大学</h3>
                        <h2>传真：</h2>
                        <p>Fax:</p>
                        <h3>05575828968</h3>
                        <h2>电话：</h2>
                        <p>Tel:</p>
                        <h3>0561-3802652</h3>
                        <ul class="ghj">
                            <li class="pop">
                                <input type="text" placeholder="姓名">
                            </li>
                            <li>
                                <input type="text" placeholder="你的邮箱">
                            </li>
                        </ul>
                        <textarea name="aaa" id="fda" cols="30" rows="10">写信息</textarea>
                        <button>提交</button>

                    </div>
                </div>
            </div>
        </div>
    <script>
        $(".daohangleft").click(function(){
            $("html").animate({scrollTop:"0px"},1000)
        })
        $(".hjk4").click(function(){
            $("html").animate({scrollTop:"790px"},1000)
        })
        $(".hjk3").click(function(){
            $("html").animate({scrollTop:"1520px"},1000)
        })
        $(".hjk2").click(function(){
            $("html").animate({scrollTop:"2550px"},1000)
        })
        $(".hjk1").click(function(){
            $("html").animate({scrollTop:"3650px"},1000)
        })
        $(function () {
            var index = 0;
            var timer;
            // 1.点击next
            $("#next").click(function () {
                index++;
                if (index > 2) {
                    index = 0;
                }
                animate(index);
            })
            // 2.点击prev
            $("#prev").click(function () {
                index--;
                console.log(index);
                if (index < 0) {
                    index = 2;
                }
                animate(index);
            })
            // 3.焦点随左右按钮变化
            function animate(index) {
                $("#list img").eq(index).fadeIn(2000).siblings().fadeOut(2000);
                $("#btns span").eq(index).addClass("current").siblings().removeClass("current");
            }
            // 4.点击按钮,让对应的图片出现
            $("#btns span").click(function () {
                $(this).addClass("current").siblings().removeClass("current");
                index = $(this).index();
                $("#list img").eq(index).fadeIn(2000).siblings().fadeOut(2000);

            })
            //5.自动播放
            function play() {
                timer = setInterval(function () {
                    $("#next").click()
                }, 3000)
            }
            function stop() {
                clearInterval(timer)
            }
            $(".content").mouseover(function(){
                stop();
            })
            $(".content").mouseout(function(){
                play();
            })
            play();
        })
    </script>
</body>
</html>